<template>
  <div class="description">
    <img src="./img/img_header.png" class="header">
    <div class="description-1">本期国庆中秋积分大狂欢活动（9.25-10.10）已经结束，查查君在此恭喜中奖的查友们！<br><br>即日起，各位查友只要登录我查查APP<span style="color: #319ef8">最新版本</span>，进入<span style="color: #319ef8">个人中心-我的关注-奖品</span>，即可查看在本次活动中获得奖品详情。
    </div>
    <div class="description-2">
      <div class="title">紧急提示!</div>
      <br>
      中奖的查友们，<span style="color: #319ef8">请于10月18日前完善姓名、手机、地址信息</span>，要不然查查君没办法把奖品寄给你们呀!
      <br>
      <br>
      10月18日仍未完善信息，导致查查君无法联系上的中奖用户，按照活动规则，查查君只能遗憾的当做“用户主动弃奖”来处理。
      <br>
      <br>
      中奖用户<span style="color: #319ef8">请保持手机畅通</span>，查查君会与你电话确认中奖情况及地址信息，然后寄出奖品。
      <br>
      <br>
      查友们如有疑问请拨打热线电话400-666-9301，咨询查查君。
    </div>
    <div class="bottom-wrapper">
      <div class="btn-wrapper" @click="toMy">我的积分狂欢</div>
      <div class="download" @click="download" v-show="showDownload">升级到最新版本>></div>
    </div>
    <m-result-dialog v-show="isDialogShow" @listenToDialog="listenTheDialog" :type="dialogType"></m-result-dialog>
  </div>
</template>

<style lang="stylus" type="text/stylus" rel="stylesheet/stylus">

  .description
    top 0
    left 0
    width 100%
    min-height 100%
    height auto
    background-color #f3f3f3
    text-align center
    .header
      width 100%
    .description-1
      width 78%
      margin .4rem auto 0 auto
      padding .2rem .4rem
      color black
      text-align justify
      font-size .25rem
      line-height .3rem
      border-radius .05rem
      background-color white
    .description-2
      width 78%
      margin .6rem auto 0 auto
      padding .2rem .4rem
      color black
      text-align justify
      font-size .25rem
      line-height .3rem
      border-radius .05rem
      background-color white
      .title
        font-size .3rem
        line-height .35rem
        text-align center
        color #319ef8
    .bottom-wrapper
      width 100%
      margin-top .4rem
      padding-bottom .2rem
      position relative
      .btn-wrapper
        width 3.13rem
        height 1.18rem
        margin 0 auto
        background-image url("./img/img_btn_normal.png")
        background-size 3.13rem 1.18rem
        color white
        font-size .3rem
        line-height 1rem
      .download
        position absolute
        right .2rem
        top .4rem
        color #319ef8
        font-size .24rem
        text-decoration underline

</style>

<script type="text/ecmascript-6">

  import mResultDialog from '../../components/join_result_dialog/JoinResultDialog.vue'

  export default{
    data() {
      return {
        showDownload: false,
        isDialogShow: false,
        isLogin: false,
        dialogType: ''
      }
    },
    created() {
      if (!this.utils.notLessThan935()){
        this.showDownload = true
      }
    },
    methods: {
      toMy() {
        let vue = this
        if (vue.utils.supportGetNativeParameter()){
          this.wccia.getNativeParameter(function(params){
            if (params) {
              if (typeof params === 'string') {
                params = JSON.parse(params)
              }
              if (params.urid) {
                vue.isLogin = true
              }
              if (vue.isLogin && vue.utils.supportWccia()) {
                vue.utils.doRouter(vue, '/myparticipation', {'h5title': '我的夺宝'})
              } else if (!vue.isLogin) {
                vue.wccia.checkLogin(function (urid) {})
              } else {
                vue.dialogType = '6'
                vue.isDialogShow = true
              }
            }
          })
        } else {
          vue.dialogType = '6'
          vue.isDialogShow = true
        }
      },
      download() {
        if (this.utils.supportWccia()) {
          location.href = "wccia://webview/" + this.wccconfig.OFFICIAL_WEB_URL
        } else {
          this.dialogType = '6'
          this.isDialogShow = true
        }
      },
      listenTheDialog(type){ /** type： 0-分享；1-扫码；2-看看其他；3-OK 5-关闭*/
        this.isDialogShow = false
      },
    },
    components: {
      mResultDialog
    }
  }
</script>
